<script setup lang='ts'>
import { useEditBuyerInfo, useGetBuyerInfo } from '@fl/api/purchase'

const emits = defineEmits(['submit'])
const { isPending, mutateAsync } = useEditBuyerInfo()
const { data, isLoading } = useGetBuyerInfo()
const state = reactive({
    contactAddress: '',
    contactEmail: '',
    contactMobile: '',
    contactName: '',
    enterpriseId: '',
    id: '',
})
const group = [
    {
        columns: [
            {
                colProps: {
                    span: 8,
                },
                fieldProps: { disabled: true },
                label: '统一社会信用代码',
                prop: 'unifiedSocialCreditCode',
            },
            {
                colProps: {
                    span: 8,
                },
                fieldProps: { disabled: true },
                label: '法定代表人',
                prop: 'legalRepresentative',
            },
            {
                colProps: {
                    span: 8,
                },
                fieldProps: { disabled: true },
                label: '注册地址',
                prop: 'registeredAddress',
            },
            {
                colProps: {
                    span: 8,
                },
                fieldProps: { disabled: true },
                label: '成立日期',
                prop: 'establishmenDate',
            },
            {
                colProps: {
                    span: 8,
                },
                fieldProps: { disabled: true },
                label: '注册资本',
                prop: 'registeredCapital',
            },
            {
                colProps: {
                    span: 8,
                },
                fieldProps: { disabled: true },
                label: '企业LOGO',
                prop: 'logo',
            },
        ],
        title: '工商信息(数据来源于企查查)',
    },
    {
        columns: [
            {
                colProps: {
                    span: 8,
                },
                label: '姓名',
                prop: 'contactName',
                valueType: 'copy',
            },
            {
                colProps: {
                    span: 8,
                },
                label: '电话',
                prop: 'contactMobile',
                valueType: 'copy',
            },
            {
                colProps: {
                    span: 8,
                },
                label: '通讯地址',
                prop: 'contactAddress',
                valueType: 'copy',
            },
            {
                colProps: {
                    span: 8,
                },
                label: '邮箱',
                prop: 'contactEmail',
                valueType: 'copy',
            },
        ],
        title: '联系人信息',
    },

]
async function submit() {
    const params = {
        contactAddress: state.contactAddress,
        contactEmail: state.contactEmail,
        contactMobile: state.contactMobile,
        contactName: state.contactName,
        enterpriseId: state.enterpriseId,
        id: state.id,
    }
    const res = await mutateAsync(params)
    console.log(res)
    if (res === 1) {
        ElMessage.success('修改成功')
        emits('submit')
    }
}
watchEffect(() => {
    Object.assign(state, data.value)
})
</script>

<template>
    <el-skeleton v-if="isLoading"
                 :rows="5"
    />

    <PlusForm v-else
              v-model="state"
              :group="group"
              submit-text="查询"
              label-position="top"
              :row-props="{ gutter: 20 }"
              @submit="submit"
    >
        <template #plus-field-logo>
            <el-image v-if="data?.logo"
                      style="width: 50px; height: 50px"
                      :src="data?.logo"
                      :preview-src-list="[data?.logo]"
                      fit="cover"
            />
        </template>

        <template #footer="{ handleSubmit }">
            <div style="margin: 0 auto">
                <el-button type="primary"
                           :loading="isPending"
                           @click="handleSubmit"
                >
                    提交
                </el-button>
            </div>
        </template>
    </PlusForm>
</template>
